@charset "utf-8";
.wrap {
  width: 100%;
  max-width: 10rem;
  margin: 0 auto;
  position: relative;
  background-color: #f8f6f6;
}
.wrap .header {
  width: 100%;
  margin-bottom: .266667rem;
}
.wrap .header .swiper-slide {
  width: 100%;
  height: 4.266667rem;
}
.wrap .header .swiper-slide img {
  width: 100%;
  height: 100%;
}
.wrap .header .header-box {
  width: 100%;
  box-sizing: border-box;
  padding: 0 .266667rem;
}
.wrap .header .header-box .clfi-box {
  width: 100%;
  background-color: #fff;
  box-sizing: border-box;
  padding: .533333rem 0;
  overflow: hidden;
  margin-top: -0.4rem;
  position: relative;
  z-index: 1000;
  border-top-right-radius: .106667rem;
  border-top-left-radius: .106667rem;
}
.wrap .header .header-box .clfi-box .clfi-list {
  width: 33.33333333%;
  float: left;
}
.wrap .header .header-box .clfi-box .clfi-list a {
  display: inline-block;
  text-decoration: none;
  width: 100%;
  height: 100%;
  text-align: center;
}
.wrap .header .header-box .clfi-box .clfi-list a img {
  width: 2rem;
  height: 2rem;
  margin-bottom: .133333rem;
}
.wrap .header .header-box .clfi-box .clfi-list a p {
  font-size: .373333rem;
  color: #333;
}
.wrap .header .header-box .notice-box {
  width: 100%;
  background-color: #fff;
  box-sizing: border-box;
  border-top: 1px solid #efefef;
  padding: 0 .266667rem;
  border-bottom-right-radius: .106667rem;
  border-bottom-left-radius: .106667rem;
}
.wrap .header .header-box .notice-box .img-box {
  display: inline-block;
  box-sizing: border-box;
  padding: .266667rem .266667rem .266667rem 0;
  vertical-align: middle;
  border-right: 1px solid #efefef;
}
.wrap .header .header-box .notice-box .img-box img {
  width: .546667rem;
  height: .546667rem;
}
.wrap .header .header-box .notice-box .notice-right {
  float: right;
  vertical-align: middle;
  font-size: .32rem;
  color: #666;
  width: 8rem;
  padding: .266667rem  0;
}
.wrap .content {
  width: 100%;
  box-sizing: border-box;
  padding: 0 .266667rem;
  margin-bottom: 1.333333rem;
}
.wrap .content .promotion-box {
  width: 100%;
  box-sizing: border-box;
  background-color: #fff;
  margin-bottom: .266667rem;
}
.wrap .content .promotion-box a {
  display: inline-block;
  width: 100%;
  height: 100%;
  text-decoration: none;
}
.wrap .content .promotion-box a .top-left {
  width: 4.733333rem;
  height: 3.133333rem;
  box-sizing: border-box;
  border-right: 1px solid #efefef;
  border-bottom: 1px solid #efefef;
  padding: .266667rem .266667rem 0 .266667rem;
  display: inline-block;
}
.wrap .content .promotion-box a .top-left img {
  width: 1.24rem;
  height: .346667rem;
}
.wrap .content .promotion-box a .top-left .topleft-bottom {
  width: 100%;
}
.wrap .content .promotion-box a .top-left .topleft-bottom .tlb-list {
  width: 1.25rem;
  text-align: center;
  display: inline-block;
  margin-right: .08rem;
}
.wrap .content .promotion-box a .top-left .topleft-bottom .tlb-list:last-child {
  margin-right: 0;
}
.wrap .content .promotion-box a .top-left .topleft-bottom .tlb-list img {
  width: 1.2rem;
  height: 1.2rem;
}
.wrap .content .promotion-box a .top-left .topleft-bottom .tlb-list p {
  color: #333;
  font-size: .293333rem;
}
.wrap .content .promotion-box a .top-left .topleft-bottom .tlb-list .yuan {
  color: #999;
  font-size: .266667rem;
  text-decoration: line-through;
}
.wrap .content .promotion-box a .topbottom-right {
  width: 4.733333rem;
  height: 3.133333rem;
  border-bottom: 1px solid #efefef;
  float: right;
  box-sizing: border-box;
  padding: .266667rem 0 0 .266667rem;
}
.wrap .content .promotion-box a .topbottom-right:last-child {
  border-bottom: 0;
}
.wrap .content .promotion-box a .topbottom-right h2 {
  font-size: .346667rem;
  color: #333;
}
.wrap .content .promotion-box a .topbottom-right h3 {
  font-size: .266667rem;
  color: #999;
}
.wrap .content .promotion-box a .topbottom-right .right-bottom {
  width: 100%;
  margin-top: .266667rem;
}
.wrap .content .promotion-box a .topbottom-right .right-bottom img {
  width: 1.866667rem;
  height: 1.333333rem;
  margin-right: .266667rem;
}
.wrap .content .promotion-box a .bottom-left {
  width: 4.733333rem;
  box-sizing: border-box;
  display: inline-block;
  overflow: hidden;
}
.wrap .content .promotion-box a .bottom-left .bl-list {
  width: 2.36rem;
  float: left;
  box-sizing: border-box;
  border-right: 1px solid #efefef;
  padding: .266667rem 0 0 .266667rem;
  height: 3.133333rem;
}
.wrap .content .promotion-box a .bottom-left .bl-list h2 {
  font-size: .346667rem;
  color: #333;
}
.wrap .content .promotion-box a .bottom-left .bl-list h3 {
  font-size: .266667rem;
  color: #999;
}
.wrap .content .promotion-box a .bottom-left .bl-list img {
  margin-top: .266667rem;
  width: 1.866667rem;
  height: 1.333333rem;
}
.wrap .content .recommend-box {
  width: 100%;
  box-sizing: border-box;
}
.wrap .content .recommend-box .recommend-header {
  width: 100%;
  text-align: center;
  margin-bottom: .266667rem;
  box-sizing: border-box;
}
.wrap .content .recommend-box .recommend-header img {
  width: 2.826667rem;
  height: .733333rem;
}
.wrap .content .recommend-box .recommend-lists {
  width: 100%;
  box-sizing: border-box;
}
.wrap .content .recommend-box .recommend-lists .recommend-list {
  display: inline-block;
  width: 4.666667rem;
  margin-right: .013333rem;
  margin-bottom: .266667rem;
}
.wrap .content .recommend-box .recommend-lists .recommend-list a {
  display: inline-block;
  width: 100%;
  height: 100%;
  text-decoration: none;
}
.wrap .content .recommend-box .recommend-lists .recommend-list a img {
  width: 4.666667rem;
  height: 3.733333rem;
  border-top-left-radius: .106667rem;
  border-top-right-radius: .106667rem;
}
.wrap .content .recommend-box .recommend-lists .recommend-list a .relist-bottom {
  width: 100%;
  box-sizing: border-box;
  padding: .266667rem;
  background-color: #fff;
  overflow: hidden;
  border-bottom-left-radius: .106667rem;
  border-bottom-right-radius: .106667rem;
}
.wrap .content .recommend-box .recommend-lists .recommend-list a .relist-bottom h3 {
  width: 100%;
  font-size: .373333rem;
  color: #333;
  margin-bottom: .266667rem;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.wrap .content .recommend-box .recommend-lists .recommend-list a .relist-bottom .price {
  font-size: .373333rem;
  color: #ff3737;
}
.wrap .content .recommend-box .recommend-lists .recommend-list a .relist-bottom .buy {
  width: 1.6rem;
  height: .6rem;
  line-height: .6rem;
  color: #fff;
  background-color: #ff3737;
  border-radius: .106667rem;
  float: right;
  text-align: center;
  font-size: .346667rem;
}
.wrap .content .recommend-box .recommend-lists .recommend-list:nth-of-type(2n) {
  margin-right: 0;
}
.wrap .content .recommend-box .tishi {
  width: 100%;
  box-sizing: border-box;
  text-align: center;
  font-size: .266667rem;
  color: #999;
  padding-bottom: .4rem;
}
